<!--
 * @Author: lp 654528967@qq.com
 * @Date: 2022-05-11 15:28:39
 * @LastEditors: lp 654528967@qq.com
 * @LastEditTime: 2022-06-20 17:34:23
 * @FilePath: \nien-vue3-admin\src\views\myMission\myProcess\closedProcess\index.vue
 * @Description: 已结束任务
-->
<template>
  <div>
    <customContainer :config="config" />
    <Detail
      v-model:visible="visible"
      :title="title"
      :data="data"
      disabled
    ></Detail>
  </div>
</template>
<script lang='ts' setup>
import { ref, resolveComponent } from 'vue'
import Detail from '@/views/myMission/components/detail.vue'
import { instanceFinish } from '@/api/myMission/myProcess/closedProcess'
import { approvalHistory } from '@/views/myMission/hooks'
import { instanceDetail } from '@/api/myMission/myProcess/runningProcess'

const visible = ref(false), title = ref(''), data = ref({}), config = {
  query: {
    fields: [
      {
        label: '流程名称',
        prop: 'taskName',
      },
      {
        label: '流程发起人',
        prop: 'taskName',
      },
    ],
    queryParams: {
      pageSize: 10,
      pageNum: 1,
      taskName: undefined,
    },
  },
  table: {
    columns: [
      // { type: 'index', label: '序号', width: '55' },
      { label: '流程发起人', prop: 'initiator' },
      { label: '任务名称', prop: 'processName' },
      // { label: '业务状态', prop: 'taskName' },
      // { label: '原因详情', prop: 'taskName' },
      { label: '流程标识Key', prop: 'processKey' },
      { label: '版本号', prop: 'version' },
      { label: '流程实例ID', prop: 'processInstanceId' },
      { label: '开始日期', prop: 'startTime' },
      // { label: '结束日期', prop: 'taskName' },
      {
        label: '操作',
        className: 'custormFixedCol',
        showOverflowTooltip: false,
        fixed: 'right',
        width: '150',
        render(h, { row }) {
          return [
            h(resolveComponent('ElButton'), {
              onClick: async () => {
                title.value = '审批历史'
                const { data: resData } = await approvalHistory({ row, visible, api: instanceDetail, key: 'processInstanceId' })
                data.value = resData
              },
              text: true,
              loading: row.loading,
              type: 'primary',
            }, () => '审批历史'),
            h(
              resolveComponent('ElButton'),
              {
                text: true,
                type: 'primary',
                onClick: () => {
                  console.log(row)
                },
              },
              () => '删除',
            ),
          ]
        },
      },
    ],
    // event: {
    //   onRowClick(e) {
    //     console.log(e)
    //   },
    // },
  },
  api: instanceFinish,
  customKey: 'myMission/myProcess/closedProcess',
}

</script>
<script lang="ts">
export default {
  name: 'ClosedProcess',
}
</script>